<template>
  <div class="content">
    <autoScrollMain
      :list="addressInfo"
      :speed="1"
      :waitTime="300"
      :singleHeight="100"
    >
      <div
        class="content-item"
        v-for="(item, index) in addressInfo"
        :key="index"
      >
        <div>{{ item.city }}</div>
        <div>{{ item.area }}</div>
        <div>{{ item.street }}</div>
      </div>
    </autoScrollMain>
  </div>
</template>

<script setup>
import autoScrollMain from "./components/autoScrollMain.vue";

const addressInfo = [
  { city: "北京市", area: "东城区", street: "东华门街道" },
  { city: "北京市", area: "东城区", street: "景山街道" },
  { city: "北京市", area: "东城区", street: "交道口街道" },
  { city: "北京市", area: "东城区", street: "安定门街道" },
  { city: "北京市", area: "东城区", street: "北新桥街道" },
  { city: "北京市", area: "东城区", street: "南锣鼓巷街道" },
  { city: "北京市", area: "东城区", street: "朝阳门街道" },
  { city: "北京市", area: "东城区", street: "东四街道" },
  { city: "北京市", area: "东城区", street: "朝阳门街道" },
  { city: "北京市", area: "东城区", street: "东花市街道" },
  { city: "北京市", area: "东城区", street: "体育馆路街道" },
  { city: "北京市", area: "东城区", street: "和平里街道" },
  { city: "天津市", area: "和平区", street: "小白楼街道" },
  // { city: "天津市", area: "和平区", street: "劝业场街道" },
  // { city: "天津市", area: "和平区", street: "五大道街道" },
  // { city: "天津市", area: "和平区", street: "新兴街道" },
  // { city: "西安市", area: "莲湖区", street: "北关街道" },
  // { city: "西安市", area: "莲湖区", street: "北院门街道" },
  // { city: "西安市", area: "莲湖区", street: "劳动路街道" },
  // { city: "西安市", area: "莲湖区", street: "西关街道" },
  // { city: "西安市", area: "莲湖区", street: "北大街街道" },
  // { city: "西安市", area: "莲湖区", street: "西市场街道" },
  // { city: "西安市", area: "莲湖区", street: "钟楼街道" },
  // { city: "西安市", area: "莲湖区", street: "新市场街道" },
  // { city: "西安市", area: "莲湖区", street: "北大街街道" },
];
</script>

<style lang="less" scoped>
.content {
  width: 260px;
  height: 300px;
  border: 1px solid #000;
}

.content-item {
  display: flex;
  justify-content: space-between;
  width: 260px;
  height: 30px;
  background-color: skyblue;
  color: #fff;
  line-height: 30px;
  padding: 0 10px;
  box-sizing: border-box;
}
</style>
